<template>
    <el-menu
            router
            class="main-menu main-shadow menu-fixed h-full"
            :collapse="isCollapse"
            @select="selectMenu"
            :default-active="$route.path"
            >
        <p class="main-logo">
            <img src="../static/images/universe.png" height="33" width="33"/>
            <span class="ml-4">右安</span>
        </p>
        <el-scrollbar :native=false wrapStyle="" wrapClass="" viewClass="" viewStyle="" :noresize=false tag="section">
            <navigation-item v-for="menu in menuList" :key="menu.path" :item="menu"/>
        </el-scrollbar>
    </el-menu>
</template>

<script>

    import navigationItem from "../components/common/navigationItem";
    import Global from "../Global";

    export default {
        name: "commonNav",
        data() {
            return {
                isCollapse: false,
                menuList: [],
            }
        },
        created() {
                this.menuList = Global.routerList;
        },
        methods: {
            selectMenu(index) {
                // 再菜单中寻找该菜单项
                let menu = this.findSelectMenu(this.menuList,index)
                this.$emit('selectMenu',menu);
            },
            findSelectMenu(menuList,index) {
                for(let i=0; i<menuList.length; i++) {
                    if(index == menuList[i].absPath) {
                        return menuList[i];
                    }else {
                        if(null == menuList[i].children) {
                            continue;
                        }else {
                            return this.findSelectMenu(menuList[i].children,index);
                        }
                    }
                }
            }
        },
        components: {
            navigationItem
        }
    }
</script>

<style scoped>
</style>